<template>
  <el-cascader
      placeholder="地区"
      v-model="data"
      :options="options"
      :props="{ expandTrigger: 'hover',emitPath:false}"
      clearable
      filterable>
    <template slot-scope="{ node }">
      <i class="iconfont icon-fenlei-remen" v-if="node.data.label==='热门'" style="color: red"></i>
      {{ node.label }}
    </template>
  </el-cascader>
</template>

<script>
export default {
  name: "CitysCascafers",
  data() {

    return {
      data: "",
      options: [{value: "", label: "", children: null}],
    }
  },
  methods: {
    getCitys() {
      this.$api.getGenericSelect({params: {"type": "city"}}
      ).then(rep => {
        this.options = rep.data
      })
    },
  },
  beforeMount() {
    this.getCitys()
  },
}
</script>
